<template>
  <div class="container">
    <h2 class="handle-title">系统管理 > 编辑用户</h2>
    <el-form ref="form" :model="form" class="demo-ruleForm" label-width="140px" style="width:430px">
      <el-form-item label="用户名" prop="username">
        <el-input v-model="form.username" :readonly="true" style="width:190px" maxlength="20"></el-input>
      </el-form-item>
      <el-form-item label="用户姓名" prop="usertruename">
        <el-input v-model="form.usertruename" :readonly="true" style="width:190px" maxlength="20"></el-input>
      </el-form-item>
      <el-form-item label="联系电话" prop="userphone">
        <el-input v-model="form.userphone" :readonly="true" style="width:190px" maxlength="11"></el-input>
      </el-form-item>
      <el-form-item label="照片" prop="showpic">
        <el-image
          style="width: 100px; height: 100px"
          :src="form.showpic"
          fit="cover">
        </el-image>
      </el-form-item>
      <el-form-item label="出身日期">
        <el-date-picker
          style="width:190px"
          class="pickerStyle"
          v-model="times"
          type="date"
          size="small"
          :disabled="true"
          @change="setTime"
          placeholder="选择时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="用户职业" prop="useroccupation">
        <el-input v-model="form.useroccupation" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="专业" prop="usermajor">
        <el-input v-model="form.usermajor" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="email" prop="useremail">
        <el-input v-model="form.useremail" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="是否教师：">
        <template v-model="{form}">
          <el-tag type="success">
            {{form.isteacher}}
          </el-tag>
        </template>
      </el-form-item>
      <el-form-item label="是否销售：">
        <template v-model="{form}">
          <el-tag type="success">
            {{form.issaler}}
          </el-tag>
        </template>
      </el-form-item>
      <el-form-item label="微信昵称" prop="nickname">
        <el-input v-model="form.nickname" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="unionid" prop="unionid">
        <el-input v-model="form.unionid" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="openid" prop="openid">
        <el-input v-model="form.openid" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="易启学账户id" prop="edusohoid">
        <el-input v-model="form.edusohoid" :readonly="true" style="width:190px"></el-input>
      </el-form-item>
      <el-form-item label="用户状态">
        <el-select v-model="form.userstate" style="width:190px" placeholder="请选择角色状态">
          <el-option label="可用" value="1"></el-option>
          <el-option label="不可用" value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onUpdate()">修改</el-button>
        <el-button @click="goBack">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  import {getUserDetail} from "../../api/public/api";
  import {updateUser} from "../../api/public/api";

  export default {
    name: '',
    data() {
      return {
        form: {
          username: "", //用户名
          usertruename: "", //用户姓名
          userphone: "", //联系电话
          showpic: "", //头像照片
          userstate: "1", //用户状态
          userbirthyear: "",  //用户出生年
          userbirthmonth: "",//用户出生月
          userbirthday: "", //用户出生日
          useroccupation: "",//用户职业
          usermajor: "",//专业
          useremail: "",//用户邮箱
          isteacher: "",//是否是教师
          issaler: "",//是否销售
          nickname: "",//微信昵称
          unionid: "",//微信端unionid
          openid: "",//微信端openid
          edusohoid: "",//易启学账户id
        },
        times: "",
        userId: ""
      }
    },
    mounted() {
      let that = this;
      //获取修改的数据id
      this.userId = this.$route.query.id
      //console.log(this.userId)
      getUserDetail(this.userId).then((res) => {
        //console.log(res.data.data)
        res.data.data.userstate = res.data.data.userstate + "";
        res.data.data.isteacher = res.data.data.isteacher == 1 ? "是" : "否"
        res.data.data.issaler = res.data.data.issaler == 1 ? "是" : "否"
        that.form = res.data.data;
        this.times = res.data.data.userbirthyear + "-" + res.data.data.userbirthmonth + "-" + res.data.data.userbirthday
      })
    },
    methods: {
      //处理时间
      setTime(value) {
        // console.log(value)
        let year = value.getFullYear();
        let month = value.getMonth() + 1;
        let day = value.getDate();
        // console.log(year,month,day)
        this.form.userbirthyear = year;
        this.form.userbirthmonth = month;
        this.form.userbirthday = day;
      },
      //上传
      onUpdate() {
        let that = this;
        that.form.isteacher = that.form.isteacher == "是" ? 1 : 0;
        that.form.issaler = that.form.issaler == "是" ? 1 : 0;
        let isteacher = parseInt(that.form.isteacher);
        let issaler = parseInt(that.form.issaler);

        // console.log(that.form)
        let params = {
          userid: that.userId,
          userstate: that.form.userstate
        };
        // console.log(params)
        updateUser(params).then((res) => {
          // console.log(res.data.code)
          if (res.data.code == 1) {
            that.$message({
              message: "修改成功",
              type: "success",
            });
            that.$router.go(-1);
          }
        })
      },
      goBack() {
        this.$router.go(-1);
      }
    },
  }
</script>

<style scoped>

</style>
